<p>todolist works!</p>
<input type="text" [(ngModel)]="username" (keyup)="addusername($event)" >
<button (click)="getusername()" >增加</button>
<!--通过双向数据绑定获取新的值-->
<button (click)="addusername($event)">add list</button>
<ul>
  <li *ngFor="let item of list;let i=index">
    <input *ngIf="item.status" type="checkbox" checked="checked" >
    <input *ngIf="!item.status" type="checkbox"  >

    {{i}}---{{item.username}}
    <button (click)="deleteItem(i)" >删除</button>
    <button (click)="changeData(i)" >修改</button>
  </li>
</ul>

<h2>正在进行</h2>
<ul>
  <li *ngFor="let item of list;let i=index" [hidden]="item.status==false" >
    <input *ngIf="item.status" type="checkbox" checked="checked" >
    <input *ngIf="!item.status" type="checkbox"  >

    {{i}}---{{item.username}}
    <button (click)="deleteItem(i)" >删除</button>
    <button (click)="changeData(i)" >修改</button>
  </li>
</ul>

<h2>已经完成</h2>
<ul>
  <li *ngFor="let item of list;let i=index" [hidden]="item.status==true" >
    <input *ngIf="item.status" type="checkbox" checked="checked" >
    <input *ngIf="!item.status" type="checkbox"  >

    {{i}}---{{item.username}}
    <button (click)="deleteItem(i)" >删除</button>
    <button (click)="changeData(i)" >修改</button>
  </li>
</ul>
